<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>时钟</title>
</head>
<body>
<p id="myclock" style="font-size:24px"></p>
<button id="startBtn">开始</button>
<button id="stopBtn">停止</button>
<script>
    let myclock = document.getElementById("myclock");
    let startBtn = document.getElementById("startBtn");
    let stopBtn = document.getElementById("stopBtn");
    callback();
    let mytimer = setInterval(callback, 1000);
    function callback() {
        var mydate = new Date();
        myclock.innerHTML = mydate.getHours() +
            ":" + mydate.getMinutes() +
            ":" + mydate.getSeconds();
    }
    //启动按钮事件
    startBtn.onclick = function() {
        if (mytimer == null) {
            mytimer = setInterval(callback, 1000);
        }
    };
    //停止按钮事件
    stopBtn.onclick = function() {
        clearInterval(mytimer);
        mytimer = null;
    };
</script>
</body>
</html>
</body>
</html>